<template>
	<!--用户首页-->
	<view class="content">
		<!-- banner -->
		<view class="banner"><u-swiper :list="swipers" indicator indicatorMode="line" circular></u-swiper></view>

		<!--三个点击图片-->
		<view class="home-icon">
			<view class="add-home-icon">
				<view class="ad-icon" @click="goscan">
					<image src="../../../static/icon/piao7.png" />
					<view class="ad-icon-text">信息填写</view>
				</view>
				<view class="ad-icon" @click="imageURLs">
					<image src="../../../static/icon/piao5.png" />
					<view class="ad-icon-text">抬头列表</view>
				</view>
				<view class="ad-icon" @click="billingList">
					<image src="../../../static/icon/piao4.png" />
					<view class="ad-icon-text">票夹列表</view>
				</view>
			</view>
		</view>
		<!--抬头列表-->
		<view class="contenter">
			<!--发票列表显示开始-->
			<view class="indexList" v-for="(item, ticketLists) in ticketLists" @click="toDetail(item.id)">
				<view class="ad-indexList">
					<view class="ad-List">
						<!--显示抬头名称-->
						<view class="ad-List-text">
							发票名称:	
						<view class="list-text-01">{{ item.invoiceName }}</view>
						</view>

						<!--显示税号-->
						<view class="ad-List-text">
							税号:	
						<view class="list-text-01">{{ item.taxNo }}</view>
						</view>

						<!--显示金额-->
						<view class="ad-List-text">
							金额:	
						<view class="list-text-01">{{ item.txnAmt }}</view>
						</view>

						<!--显示开票内容-->
						<view class="ad-List-text" v-if="item.content">
							开票内容:
							<view class="list-text-01" >{{item.content}}</view>
						</view>
						<!--显示状态-->
						<view class="ad-List-text">
							状态:
							<view class="list-text-01">
								<view v-if="item.state == '1'">客户新增</view>
								<view v-else-if="item.state == '2'">商家已处理</view>
								<view v-else-if="item.state == '3'">后台已处理</view>
								<view v-else-if="item.state == '4'">已退回</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!--发票列表显示结束-->
		</view>
		<view class="bgimge" v-if="ticketLists.length <= 0"><image src="/static/icon/empty3.png"></image></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			ticketLists: {}, //发票列表
			title: 'Hello',
			swipers: ['/static/icon/ban1.png', '/static/icon/ban2.png', '/static/icon/ban3.png'],
			userinfo: {}
		};
	},
	onShow() {
		const pages=getCurrentPages();
		const perpage=pages[pages.length-1];
		perpage.onLoad();
	},
	onLoad() {
		var me = this;
		uni.setStorageSync('ROLE', 1);
		//用户是否登录 获取openId,并判断是否是用户
		var userinfo = uni.getStorageSync('user'); //userinfo取用户信息
		console.log('userinfo:' + JSON.stringify(userinfo));
		if (!userinfo) {
			console.log('1111');
			uni.login({
				provider: 'weixin',
				success(wxRes) {
					var code = wxRes.code;
					console.log('code=' + code);
					uni.request({
						url: me.$ServerUrl + '/invoice/api/wx/getUserInfo', //根据微信code获取用户openId,并判断是否存在该用户，若存在返回该用户，否则新生成用户
						data: {
							code: code
						},
						header: {
							'content-type': 'application/x-www-form-urlencoded' // 默认值JSON格式
						},
						method: 'GET',
						success: res => {
							console.log('user=' + res.data);
							var user = res.data;
							uni.setStorageSync('user', user); //把用户存入缓存中
							me.userinfo = user; //将用户存储到userinfo里
							uni.request({
								url: me.$ServerUrl + '/invoice/api/invoice/getInvoiceListByCustomerId', //根据用户ID显示发票
								data: {
									customerId: user.id
								},
								header: {
									'content-type': 'application/x-www-form-urlencoded' // 默认值JSON格式
								},
								method: 'GET',
								success: res => {
									console.log('res' + JSON.stringify(res));
									me.ticketLists = res.data;
									console.log(me.ticketLists);
									console.log(res);
								}
							});
						}
					});
				}
			});
		} else {
			console.log('222');
			me.userinfo = userinfo;
			console.log('===' + JSON.stringify(userinfo));
			console.log(uni.getStorageInfoSync());
			uni.request({
				url: me.$ServerUrl + '/invoice/api/invoice/getInvoiceListByCustomerId', //根据用户ID显示抬头
				data: {
					customerId: userinfo.id
				},
				header: {
					'content-type': 'application/x-www-form-urlencoded' // 默认值JSON格式
				},
				method: 'GET',
				success: res => {
					console.log('res' + JSON.stringify(res));
					me.ticketLists = res.data;
					console.log(me.ticketLists);
					console.log(res);
				}
			});
		}
	},
	methods: {
		toDetail(id) {
			uni.navigateTo({
				url: '../mine/ticket/upticket?id=' + id
			});
		},
		imageURLs() {
			uni.navigateTo({
				url: '../mine/mine-wdtt/mine-wdtt-qy/ttlb'
			});
		},
		goscan() {
			uni.switchTab({
				url: '../scan/index'
			});
		},
		billingList() {
			uni.navigateTo({
				url: '../mine/ticket/index'
			});
		}
	}
};
</script>

<style lang="scss">
page {
	width: 100%;
	height: 100%;
	background-color: #e1e5eb;
}

.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	height: 100%;
}


.banner {
	width: 95%;
	margin-top: 5px;
}
// list
.indexList {
	width: 100%;
	border-radius: 10px;
	margin-bottom: 10px;
}

.ad-indexList {
	border: 1px solid #ffffff;
	border-radius: 10px;
	background-color: #ffffff;
	margin-top: 5px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 10px;
	box-shadow: 2px 2px 2px #a1a1a1;
}

.ad-List {
	font-size: 14px;
}

.ad-List-text {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	display: flex;
	margin-bottom: 5px;
	width: 90%;
}

.list-text-01 {
	margin-left: 10px;
	width: 100%;
	overflow: auto;
}

// icon
.home-icon {
	width: 100%;
}

.add-home-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 10px;
	text-align: center;
	border: 1px solid #ffffff;
	padding: 15px;
	border-radius: 10px;
	background-color: #ffffff;
}

.ad-icon {
	padding-left: 25px;
	padding-right: 25px;
	width: 100%;
}

.ad-icon image {
	height: 45px;
	width: 45px;
}

.ad-icon-text {
	font-size: 10px;
}

.contenter {
	width: 100%;
}

.bg-imge {
	height: 64px;
	width: 64px;
}

.bgimge {
	color: #999999;
	text-align: center;
	justify-content: center;
	align-items: center;
	
}
.bgimge image{
	width: 150px;
	height: 170px;
}
</style>
